import store from "@/store/index";
import { Local, Session } from "@/utils/storage";
import type { Directive, DirectiveBinding } from "vue";
import { buildMenuTree, getMenuTree } from "@/router/menuHelper";
import menuHook from "@/hooks/menuHook/menuHook";
import hooks from "@/hooks";
const menuName: any = ref(null)


interface ElType extends HTMLElement {
  copyData: string | number;
  __handleClick__: any;
}
/**
 * 单独给个人中心使用
 */
const hasPermi: Directive = {
  mounted(el: ElType, binding: DirectiveBinding) {
    const { value } = binding;
    const sessionStorages: any = sessionStorage;
    let currentPath = "";
    watchEffect(() => {
      menuName.value = store.getters.getUserMenuName;
      currentPath = `${menuName.value?.menuKey}:${value}`
    })
    const permis = getMenuTree() ?? []
    // 选中当前菜单
    const newPermis: any = []
    //拼接权限path + flag;
    permis.map((l: any) => {
      //个人中心权限、员工详情
      if (l.menuKey === hooks.menuHook.menuFirstChoose) {
        if (menuName.value) {
          const menuKeys = l?.children[0]?.children.filter((k: any) => k.menuKey === menuName.value.menuKey)
          if (menuKeys && menuKeys?.length) {
            const kk = menuKeys[0]
            kk.viewFlag && newPermis.push(`${kk.path}:viewFlag`);
            kk.modifyFlag && newPermis.push(`${kk.path}:modifyFlag`);
            kk.createFlag && newPermis.push(`${kk.path}:createFlag`);
            kk.removeFlag && newPermis.push(`${kk.path}:removeFlag`);
            kk.upload && newPermis.push(`${kk.path}:upload`);
            const otherPers = kk.otherAuth;
            if (otherPers && otherPers.length) {
              otherPers.map((j: any) => {
                newPermis.push(`${kk.path}:${j}`);
              });
            }
          }
        }
      }
    })
    //当前路径拼权限
    // console.log('newMaps====>', newPermis, !newPermis.includes(value), value, currentPath);
    if (!newPermis.includes(currentPath)) el.style.display = "none";
  },
};
export default hasPermi